/**
 * Descriptions：
 * <p>
 * Author：ChenME
 * Date：2017/6/29
 * Email：ibelieve1210@163.com
 */

import React, {Component} from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image,
    TouchableOpacity,
} from 'react-native';

export default class CenterCommView extends Component {

    static defaultProps = {
        leftIon: '',
        leftText: '',
        rightText: '',
    };

    render() {
        return (
            <TouchableOpacity>
                <View style={styles.pageViewStyle}>
                    <View style={styles.contentViewStyle}>
                        <Image
                            source={{uri: this.props.leftIon}}
                            style={styles.leftIconStyle}
                        />
                        <Text style={{marginLeft: 4, fontSize: 16}}>{this.props.leftText}</Text>
                    </View>
                    <View style={styles.contentViewStyle}>
                        <Text style={{color: 'gray'}}>{this.props.rightText}</Text>
                        <Image
                            source={{uri: 'icon_cell_rightarrow'}}
                            style={styles.rightArrowStyle}
                        />
                    </View>

                </View>
            </TouchableOpacity>
        );
    }
}

const styles = StyleSheet.create({
    pageViewStyle: {
        flexDirection: 'row',
        backgroundColor: '#fff',
        paddingHorizontal: 10,
        height: 38,
        alignItems: 'center',
        justifyContent: 'space-between',
        borderBottomColor: '#e8e8e8',
        borderBottomWidth: 1,
    },

    contentViewStyle: {
        alignItems: 'center',
        flexDirection: 'row',
    },

    leftIconStyle: {
        width: 23,
        height: 23,
    },

    rightArrowStyle: {
        width: 8,
        height: 13,
        marginLeft: 7,
    },
});